<template>
	<view class="register">
		<view class="input-group">
			<uni-easyinput :inputBorder="false" v-model="uname" placeholder="请输入用户名" />
		</view>
		<view class="input-group">
			<uni-easyinput :inputBorder="false" type="password" v-model="upwd"
				placeholder="密码由字母、数字、特殊字符至少两种组成,8-16位" />
		</view>
		<view class="input-group">
			<uni-easyinput :inputBorder="false" type="password" v-model="upwd2" placeholder="请再次输入密码" />
		</view>
		<view class="input-group">
			<uni-easyinput :inputBorder="false" v-model="phone" placeholder="请输入手机号" />
		</view>
		<view class="input-group">
			<uni-easyinput :inputBorder="false" v-model="email" placeholder="请输入邮箱" />
		</view>
		<view @click="register" class="button">
			注册
		</view>
		<text class="go" @click="goLogin">已有账号？立即登录</text>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				uname: '',
				upwd: '',
				upwd2: '',
				email: '',
				phone: '',
			};
		},
		methods: {
			goLogin() {
				uni.redirectTo({
					url: "../login/login"
				})
			},
			register() {
				if (!this.uname) {
					uni.showToast({
						title: '用户名为空',
						icon: 'error',
						duration: 1000
					})
					return
				}
				if (!this.upwd) {
					uni.showToast({
						title: '密码为空',
						icon: 'error',
						duration: 1000
					})
					return
				}
				if (!this.phone) {
					uni.showToast({
						title: '手机号为空',
						icon: 'error',
						duration: 1000
					})
					return
				}
				if (!this.email) {
					uni.showToast({
						title: '邮箱为空',
						icon: 'error',
						duration: 1000
					})
					return
				}
				if (this.upwd != this.upwd2) {
					uni.showToast({
						title: '两次密码不一致',
						icon: 'error',
						duration: 1000
					})
					return
				}
				if (!/^1[3-9]\d{9}$/.test(this.phone)) {
					uni.showToast({
				 	title: '手机号格式错误',
						icon: 'error',
						duration: 1000
					})
					return
				}
				if (!/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/.test(this.email)) {
					uni.showToast({
						title: '邮箱格式错误',
						icon: 'error',
						duration: 1000
					})
				 return
				}
				if (!/^(?![A-Z]+$)(?![a-z]+$)(?!\d+$)(?![\W_]+$)\S{8,16}$/.test(this.upwd)) {
					uni.showToast({
						title: '密码不合格',
						icon: 'error',
						duration: 1000,
					})
					return
				}
				uni.request({
					url: this.apiServer + 'register',
					data: {
						name: this.uname,
						pwd: this.upwd,
						phone: this.phone,
						email: this.email
					},
					method: "POST",
					header: {
						'content-type': "application/x-www-form-urlencoded"
					},
					success: (res) => {
						console.log(res);
						if (res.data.code == 201) {
							uni.showToast({
								title: '请检查注册信息！',
								icon: 'error',
								duration: 1000,
							})
							return
						} else if (res.data.code == 202) {
							uni.showToast({
								title: '手机号格式错误！',
								icon: 'error',
								duration: 1000,
							})
							return
						} else if (res.data.code == 203) {
							uni.showToast({
								title: '邮箱格式错误！',
								icon: 'error',
								duration: 1000,
							})
							return
						} else if (res.data.code == 204) {
							uni.showToast({
								title: '密码不合规！',
								icon: 'error',
								duration: 1000,
							})
							return
						} else if (res.data.code == 205) {
							uni.showToast({
								title: '用户名已被占用！',
								icon: 'error',
								duration: 1000,
							})
							return
						} else if (res.data.code == 206) {
							uni.showToast({
								title: '手机号已注册！',
								icon: 'error',
								duration: 1000,
							})
							return
						} else if (res.data.code == 207) {
							uni.showToast({
								title: '邮箱已注册！',
								icon: 'error',
								duration: 1000,
							})
							return
						} else {
							uni.showToast({
								title: '注册成功！',
								icon: 'success',
								duration: 1000,
								success: () => {
									setTimeout(() => {
										uni.redirectTo({
											url:'../login/login'
										})
									}, 1500)
								}
							})
						}

					},
					fail: (err) => {
						console.log(err);
					}
				})
			}
		},
		mounted() {
			uni.setNavigationBarTitle({
				title: '注册新用户'
			})
		}
	}
</script>

<style lang="scss">
	.register {
		position: absolute;
		left: 0;
		top: 0;
		box-sizing: border-box;
		width: 750rpx;
		padding: 3px 10px;

		.input-group {
			padding: 10px 0 5px 0;
			border-bottom: 1px solid #ddd;
		}

		.button {
			background-color: #0AA1ED;
			color: white;
			text-align: center;
			border-radius: 6px;
			font-size: 16px;
			line-height: 35px;
			margin-top: 18px;
			margin-bottom: 15px;

			&:active {
				background-color: rgba(10, 161, 237, 0.8);
			}
		}

		.go {
			color: #999;

			// cursor: pointer;
			&:active {
				color: #0aa1ed;
			}
		}
	}
</style>
